<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%
    response.setHeader("cache-control","public");
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE html>
<html>
<!-- 考试详情信息公布 -->
<head>
    <meta charset="UTF-8">
    <title></title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>考务管理</title>
    <link rel="stylesheet" type="text/css" href="<%=path%>/static/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="<%=path%>/static/css/font/font-awesome.min.css">
    <!--[if IE 7]><link rel="stylesheet" href="<%=path%>/static/css/font/font-awesome-ie7.min.css"><![endif]-->
    <link rel="stylesheet" href="<%=path%>/static/css/common.css"/>
    <link rel="stylesheet" type="text/css" href="<%=path%>/static/css/examMng/core.css">
    <link rel="stylesheet" href="<%=path%>/static/css/examMng/examMng.css">
    <link rel="stylesheet" href="<%=path%>/static/css/examMng/exam-org-deta.css"/>
    <style>
        ol{
            list-style:none;
        }
        .div-answer {
            line-height:2em;
        }
        .div-title {
            line-height:3em;
            font-size:20px;
        }

        .div-pic {
            float: left;
            margin-right: 20px;
        }
    </style>
    <script src="<%=path%>/static/js/respond.js"></script>
</head>

<body>

<jsp:include page="../head.jsp" flush="true"/>

<div class="main-container albox-pad-top padingtop0">
    <div class="container body-box" style="margin-top: 25px;">
        <div class="panel-header header-bgdclr-blue " style="background: #4c4ca6">

            <div class="" style="">
                <p class="panelheader-p floatleft fontsize16">考试组织详情-<span class="sp-clr">${name }</span></p>
                <a class="panelheader-a  floatrit fontweight400" href="<%=path%>/exam/toExamList"><span
                        class="glyphicon glyphicon-arrow-left "></span> 返回列表</a>
            </div>

        </div>
        <div class="panel-body container padding-botn50">
            <div class="">
                <div class="container padding-left-ringt30">
                    <p class="panelbody-p fontsize18">${name }</p>
                </div>
                <div class=" padding-left-ringt30">
                    <p class="p-font-weight col-lg-12 col-md-12 col-sm-12 padding-20-0-5 ">考试组织：</p>
                    <div class="bdr col-lg-12 col-md-12 col-sm-12 padding-right-0">
                        <div class="examorg-left col-lg-10 col-md-10 col-sm-10">
                            <p class="p1-info col-lg-12 col-md-12 col-sm-12">
                                考试状态：
                                <span class="sp-clr-red">${publish }</span>
                            </p>

                            <p class="col-lg-7 col-md-7 col-sm-7 p-info">考试时间：
                                <span class="sp-clr-blue">${starttime }</span>
                            </p>
                            <p class="col-lg-5 col-md-5 col-sm-5 p-info">考试时长：
                                <span class="sp-clr-blue">${duration }</span>
                            </p>

                            <p class="p-info col-lg-7 col-md-7 col-sm-7 ">
                                考试人数：
                                <span class="sp-clr-blue">${renshu }</span>

                            </p>
                            <div class="col-lg-5 col-md-5 col-sm-5 p-info padding-7-0 ">
                                <button class="btn-bdr col-lg-4 col-md-4 col-sm-4 btn btn-default" style="width:120px;"
                                        data-toggle="modal" data-target="#checkStudent">
                                    <span class="glyphicon glyphicon-cog"></span>
                                    <span class="sp-clr-link-blue">查看人员</span>
                                </button>
                            </div>
                            <p class="plast-info col-lg-12 col-md-12 col-sm-12">
                                考试地点：
                                <span class="sp-clr-blue">${address }</span>
                            </p>
                        </div>
                        <div class=" examorg-right col-lg-2 col-md-2 col-sm-2 padding-right-0">
                            <img class="col-lg-12 col-md-12 col-sm-12 padding-10"
                                 src="<%=path%>/static/images/practice/graduation22.png"/>
                        </div>
                    </div>
                </div>
                <div class=" padding-left-ringt30">
                    <p class="p-font-weight col-lg-12 col-md-12 col-sm-12 padding-20-0-5 ">试卷信息：</p>
                    <div class="bdr col-lg-12 col-md-12 col-sm-12 padding-right-0 ">
                        <div class="examorg-left col-lg-10 col-md-10 col-sm-10">
                            <p class="col-lg-7 col-md-7 col-sm-7 p1-info">考试试卷：
                                <span class="sp-clr-blue">${paperName }</span>
                            </p>

                            <div class="col-lg-3 col-md-3 col-sm-3  padding-5-0 p-info">
                                <button class="btn-bdr col-lg-10 col-md-10 col-sm-10 btn btn-default"
                                        style="width:120px;" data-toggle="modal" data-target="#mymodal">
                                    <span class="glyphicon glyphicon-eye-open"></span>
                                    <span class="sp-clr-link-blue">试题预览</span>
                                </button>
                            </div>
                            <p class="col-lg-12 col-md-12 col-sm-12 p-info">对应题库：
                                <span class="sp-clr-blue">${depository }</span>
                            </p>
                            <p class="col-lg-7 col-md-7 col-sm-7 plast-info">题目数量：
                                <span class="sp-clr-blue">${questionCount }</span>
                            </p>
                            <p class="col-lg-5 col-md-5 col-sm-5 plast-info">试卷分值：
                                <span class="sp-clr-blue">${score }分</span>
                            </p>
                        </div>
                        <div class=" examorg-right col-lg-2 col-md-2 col-sm-2 padding-right-0">
                            <img class="col-lg-12 col-md-12 col-sm-12 padding-10"
                                 src="<%=path%>/static/images/practice/examorgimg.png"/>
                        </div>
                    </div>
                </div>
                <div class=" padding-left-ringt30">
                    <p class="p-font-weight col-lg-12 col-md-12 col-sm-12 padding-20-0-5 ">阅卷信息：</p>
                    <div class="bdr col-lg-12 col-md-12 col-sm-12 padding-10">
                        <div class="examorg-left col-lg-12 col-md-12 col-sm-12 paddingtopbtn-8">
                            <span class="plast-info sp-clr-blue ">当前试卷无需人工阅卷</span>
                        </div>
                    </div>
                </div>
                <div class="  padding-left-ringt30">
                    <p class="p-font-weight col-lg-12 col-md-12 col-sm-12 padding-20-0-5 ">成绩公示：</p>
                    <div class="bdr col-lg-12 col-md-12 col-sm-12 padding-right-0">
                        <div class="examorg-left col-lg-10 col-md-10 col-sm-10">
                            <p class="col-lg-7 col-md-7 col-sm-7 p1-info" style="border-bottom: none;">公示状态：
                                <span class="sp-clr-red">未公示</span>
                            </p>
                            <div class="col-lg-2 col-md-2 col-sm-2  padding-5-0 p-info" style="border-bottom: none;">
                                <div class="btn-bdr-unable col-lg-10 col-md-10 col-sm-10 btn btn-default "
                                     data-toggle="tooltip" style="width: 110px;" data-placement="top"
                                     title="在考试结束前无法查看成绩">
                                    <span class="glyphicon glyphicon-eye-open"></span>
                                    <span class="sp-clr-link-unable"><a href="#">成绩公示</a></span>
                                </div>
                            </div>
                        </div>
                        <div class=" examorg-right col-lg-2 col-md-2 col-sm-2 padding-right-0">
                            <img class="col-lg-12 col-md-12 col-sm-12 padding-10"
                                 src="<%=path%>/static/images/practice/exam.png"/>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
</div>
<!-- 模态弹出窗 -->
<div class="modal fade" id="checkStudent">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span
                        class="sr-only">Close</span></button>
                <h4 class="modal-title">考生列表</h4>
            </div>
            <div class="modal-body">
                <ul id="exmainee">
                   
                    <table class="table">
					   <thead>
					      <tr>
					         <th class="text-center">姓名</th>
					      </tr>
					   </thead>
					   <tbody>
					    <c:forEach items="${studentList }" var="student">
					      <tr>
					         <td class="text-center">${student }</td>
					      </tr>
					   </tbody>
					</table>
                    </c:forEach>
                </ul>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" style="height:34px;" data-dismiss="modal">关闭</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<div class="modal fade" id="paperInfo">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span
                        class="sr-only">Close</span></button>
                <h4 class="modal-title">模态弹出窗标题</h4>
            </div>
            <div class="modal-body">
                <p>模态弹出窗主体内容</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" style="height:34px;" data-dismiss="modal">关闭</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<div class="modal fade" id="mymodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document" style="width: 1080px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    试题预览
                </h4>
            </div>
            <div class="modal-body">
                <div>
                    <div style="width: 100%; margin-left: 30px">
                        <h4>一、单选题</h4>
                        <ol>
                            <c:forEach items="${singleList}" var="question" varStatus="status">
                                <li>
                                    <div class="div-title"><b>${status.count}.</b>${question.title}</div>
                                    <c:if test="${not empty question.picture && !(question.picture eq null) }">
                                        <img style="width: 200px;height: 250px;" src="<%=basePath%>${question.picture}"/></br>
                                    </c:if>
                                    <div class="div-pic"><b>A.&nbsp;</b>${question.a}
                                        <c:if test="${not empty question.apic && !(question.apic eq null) }">
                                            <div><img style="width: 200px;height: 250px;" src="<%=basePath%>${question.apic}"/></div>
                                        </c:if>
                                    </div>
                                    <div class="div-pic"><b>B.&nbsp;</b>${question.b}
                                        <c:if test="${not empty question.bpic && !(question.bpic eq null) }">
                                            <div><img style="width: 200px;height: 250px;" src="<%=basePath%>${question.bpic}"/></div>
                                        </c:if>
                                    </div>
                                    <div class="div-pic"><b>C.&nbsp;</b>${question.c}
                                        <c:if test="${not empty question.cpic && !(question.cpic eq null) }">
                                            <div><img style="width: 200px;height: 250px;" src="<%=basePath%>${question.cpic}"/></div>
                                        </c:if>
                                    </div>
                                    <div><b>D.&nbsp;</b>${question.d}
                                        <c:if test="${not empty question.dpic && !(question.dpic eq null) }">
                                            <div><img style="width: 200px;height: 250px;" src="<%=basePath%>${question.dpic}"/></div>
                                        </c:if>
                                    </div>
                                    <div class="div-answer">正确答案：<b>${question.answer}</b></div>
                                </li>
                            </c:forEach>
                        </ol>
                    </div>

                    <div>
                        <h4>二、多选题（每题10分，共20分）</h4>
                        <ol>
                            <c:forEach items="${mutiList}" var="question" varStatus="status">
                                <li>
                                    <div class="div-title"><b>${status.count + singlecount}.</b>${question.title}</div>
                                    <c:if test="${not empty question.picture && !(question.picture eq null) }">
                                        <img style="width: 200px;height: 250px;" src="<%=basePath%>${question.picture}"/></br>
                                    </c:if>
                                    <div class="div-pic"><b>A.&nbsp;</b>${question.a}
                                        <c:if test="${not empty question.apic && !(question.apic eq null) }">
                                            <div><img style="width: 200px;height: 250px;" src="<%=basePath%>${question.apic}"/></div>
                                        </c:if>
                                    </div>
                                    <div class="div-pic"><b>B.&nbsp;</b>${question.b}
                                        <c:if test="${not empty question.bpic && !(question.bpic eq null) }">
                                            <div><img style="width: 200px;height: 250px;" src="<%=basePath%>${question.bpic}"/></div>
                                        </c:if>
                                    </div>
                                    <div class="div-pic"><b>C.&nbsp;</b>${question.c}
                                        <c:if test="${not empty question.cpic && !(question.cpic eq null) }">
                                            <div><img style="width: 200px;height: 250px;" src="<%=basePath%>${question.cpic}"/></div>
                                        </c:if>
                                    </div>
                                    <div><b>D.&nbsp;</b>${question.d}
                                        <c:if test="${not empty question.dpic && !(question.dpic eq null) }">
                                            <div><img style="width: 200px;height: 250px;" src="<%=basePath%>${question.dpic}"/></div>
                                        </c:if>
                                    </div>
                                    <div class="div-answer">正确答案：<b>${question.answer}</b></div>
                                </li>
                            </c:forEach>
                        </ol>
                    </div>

                    <div>
                        <h4>三、判断题（每题10分，共20分）</h4>
                        <ol>
                            <c:forEach items="${judgeList}" var="question" varStatus="status">
                                <li>
                                    <div class="div-title"><b>${status.count + singlecount + muticount}.</b>${question.title}</div>
                                    <c:if test="${not empty question.picture && !(question.picture eq null) }">
                                        <img style="width: 200px;height: 250px;" src="<%=basePath%>${question.picture}"/></br>
                                    </c:if>
                                    <div class="div-pic"><b>A.&nbsp;</b>${question.a}
                                        <c:if test="${not empty question.apic && !(question.apic eq null) }">
                                            <div><img style="width: 200px;height: 250px;" src="<%=basePath%>${question.apic}"/></div>
                                        </c:if>
                                    </div>
                                    <div><b>B.&nbsp;</b>${question.b}
                                        <c:if test="${not empty question.bpic && !(question.bpic eq null) }">
                                            <div><img style="width: 200px;height: 250px;" src="<%=basePath%>${question.bpic}"/></div>
                                        </c:if>
                                    </div>
                                    <div class="div-answer">正确答案：<b>${question.answer}</b></div>
                                </li>
                            </c:forEach>
                        </ol>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
<!--body end-->
<!--[if !IE]> -->
<script type="text/javascript">
    window.jQuery || document.write("<script src='<%=path%>/static/js/jquery-2.0.3.min.js'>" + "<" + "/script>");
</script>
<!-- <![endif]-->

<script type="text/javascript">
    window.jQuery || document.write("<script src='<%=path%>/static/js/jquery-1.9.1.min.js'>" + "<" + "/script>");
</script>

<script type="text/javascript" src="<%=path%>/static/js/bootstrap.min.js"></script>
<script type="text/javascript" src="<%=path%>/static/js/tooltip.js"></script>
<script type="text/javascript">
    $(function () {
        // $('#topMain').children().eq(6).addClass('active'); // 追加样式;

        //考试管理
        if (${role eq 'master'}) {
            $('#topMain').children().eq(0).addClass('active'); // 追加样式;
            $('#topMain').children().eq(0).children().attr('href', '#');
        } else if (${role eq 'trainee'}) {
            $('#topMain').children().eq(0).addClass('active'); // 追加样式;
            $('#topMain').children().eq(0).children().attr('href', '#');
        } else {
            $('#topMain').children().eq(5).addClass('active'); // 追加样式;
            // $('#topMain').children().eq(5).children().attr('href', '#');
        }


    })
    $(document).ready(function () {
        $('[data-toggle="tooltip"]').tooltip()
    })
</script>
</body>

</html>
